<?php
/**
 * Created by dutuwang.net
 * User: adophper <hello@adophper.com>
 * Date: 2018/3/29
 * Time: 10:38
 */

$this->title = Yii::t('frontend', 'register');;
?>
<div class="contBox" style="padding-top: 200px;">
<div class="register_min">
    <div class="fbox">
        <div class="regist_left fl">
            <div class="login_min_item">
                <div class="flex login_cho">
                    快捷登陆
                    <a href="#" class="flex f_center"><i class="iconfont">&#xe62f;</i></a>
                    <a href="#" class="flex f_center"><i class="iconfont">&#xe619;</i></a>
                    <a href="#" class="flex f_center"><i class="iconfont">&#xe611;</i></a>
                </div>
            </div>
            <form id="register-form" action="<?=Yii::$app->urlManager->createUrl(['member/register'])?>" method="post">
                <input type="hidden" value="<?php echo Yii::$app->request->csrfToken; ?>" name="_csrf" id="_csrf" >
                <div class="reg_list">
                    <div class="reg_item">
                        <input type="text" name="username" placeholder="请输入用户名" maxlength="30" required value="<?=!empty($data['username'])?$data['username']:''?>" autocomplete="off"  />
                    </div>
                    <div class="reg_item">
                        <input type="number" name="mobile" id="mobile" placeholder="请输入手机号" maxlength="11" required value="<?=!empty($data['mobile'])?$data['mobile']:''?>" autocomplete="off" />
                    </div>
                    <div class="reg_item">
                        <input type="number" name="captcha" placeholder="请输入手机验证码" maxlength="6" <?=!empty($data['captcha'])?'':'disabled'?> required value="<?=!empty($data['captcha'])?$data['captcha']:''?>" autocomplete="off"  />
                        <span class="vali_code flex f_center" id="get-captcha" data-send="0">获取验证码</span>
                    </div>
                    <div class="reg_item">
                        <input type="password" name="password" placeholder="请输入登陆密码" maxlength="30" required onkeyup="checkSec(this.value)" />
                        <span class="streng flex f_between"><em></em><i></i><em></em><i></i><em></em></span>
                    </div>
                    <div class="reg_item">
                        <input type="password" name="repassword" placeholder="请确认登陆密码" maxlength="30" required/>
                    </div>
                    <div class="reg_item">
                        <input type="text" name="realname" placeholder="请输入真实姓名" required value="<?=!empty($data['realname'])?$data['realname']:''?>" autocomplete="off" />
                    </div>
                    <div class="reg_item">
                        <input type="email" name="email" placeholder="请输入电子邮箱" required value="<?=!empty($data['email'])?$data['email']:''?>" autocomplete="off" />
                    </div>
                </div>
                <div class="reg_item">
                    <input type="submit" value="注册" id="regist" class="btn_red flex f_center">
                </div>
            </form>
            <div class="reg_item no_pad">
                <div class="agreement flex">
                    <em class="check_btn checked"></em>我已看过并同意<a href="<?=Yii::$app->urlManager->createUrl(['page/agreement'])?>" target="_blank">《中国会展网注册协议》</a>
                </div>
            </div>
            <div class="reg_item">
                <div class="reg_tip">
                    <a href="<?=Yii::$app->urlManager->createUrl(['member/login'])?>">已有账号，直接登陆 &gt;</a>
                </div>
            </div>
        </div>
        <div class="regist_right fr">
            <div class="regist_right_item">
                <h3>中国领先的参展服务平台</h3>
            </div>
            <div class="regist_right_item">
                <h3>专属客服</h3>
                <p>全天候一对一服务</p>
            </div>
            <div class="regist_right_item">
                <h3>会员定制</h3>
                <p>定制全年参展计划</p>
            </div>
        </div>
    </div>
</div>
</div>
<script type="text/javascript">
$(function () {
    $("#register-form").find("input[type='text']").keydown(function (e) {
        if (e.keyCode == 13) {
            return false;
        }
    })
    $('#get-captcha').click(function () {
        var tel = $("#mobile").val();
        if (!(/^1\d{10}$/.test(tel))) {
            alert('请先输入正确的手机号码');
            return false;
        }
        $('#get-captcha').css('backgroundColor','#858585');
        /**
         * 请求发送短信验证码
         */
        if($(this).data('send') == 0){
            var time=30;
            $.ajax({
                url: '<?= Yii::$app->urlManager->createUrl(['member/sendcaptcha']) ?>',
                data: {
                    tel:tel,
                    '_csrf' : '<?= Yii::$app->request->csrfToken?>'
                },
                dataType: 'JSON',
                type: 'POST',
                async: false,
                success: function (data) {
                    $('#get-captcha').attr('data-send', 1);
                    if (data.code == 0) {
                        //alert(data.message);
                        var interval = setInterval(function(){
                            time--;
                            if(time<=0){
                                clearInterval(interval);
                                var html = '获取验证码';
                                $('#get-captcha').css('backgroundColor','#BE121E');
                                $('#get-captcha').attr('data-send', 0);
                                $("input[name='captcha']").removeAttr('disabled');
                            } else{
                                var html = time + '秒后再获取';
                                $('#get-captcha').css('backgroundColor','#858585');
                            }
                            $('#get-captcha').text(html);
                        },1000);
                    }else{
                        alert(data.message);
                        $('#get-captcha').css('backgroundColor','#BE121E');
                        return false;
                    }
                },
                error: function(response) {
                    alert(response);
                    $('#get-captcha').attr('data-send', 1);
                    $('#get-captcha').css('backgroundColor','#BE121E');
                    return false;
                }
            })
        }

    })
    $('#regist').click(function () {
        var username = $("input[name='username']").val();
        var mobile = $("input[name='mobile']").val();
        var captcha = $("input[name='captcha']").val();
        var password = $("input[name='password']").val();
        var repassword = $("input[name='repassword']").val();
        var realname = $("input[name='realname']").val();
        var email = $("input[name='email']").val();
        if(username == ''){
            alert('请输入用户名');
            return false;
        }
        if(username.match(/<|"/ig)) {
            alert('用户名包含敏感字符');
            return false;
        }
        var unlen = username.replace(/[^\x00-\xff]/g, "**").length;
        if (unlen < 3 || unlen > 15) {
            alert(unlen < 3 ? '用户名不得小于 3 个字符\n' : '用户名不得超过 15 个字符\n');
            return false;
        }
        if (/(admin|manager|administrator|guest)/.test(username)) {
            alert('请输入合法的用户名');
            return false;
        }
        if(!isMobile(mobile)){
            alert('请输入正确的电话号码');
            return false;
        }
         if(captcha == ''){
             alert('请输入手机验证码');
             return false;
         }
         if(!/^\d{6}$/.test(captcha)){
             alert('验证码输入错误');
             return false;
         }
        if(password == ''){
            alert('请输入密码');
            return false;
        }
        if(repassword == ''){
            alert('请输入确认密码');
            return false;
        }
        if (password !== repassword) {
            alert('两次密码输入不一致');
            return false;
        }
        if ($(".streng").find('em.btn_red').length < 2 ){
            alert('请重新输入一个更安全的密码');
            return false;
        }
        if(realname == ''){
            alert('请输入真实姓名');
            return false;
        }
        if(!isEmail(email)){
            alert('请输入正确的邮箱');
            return false;
        }
        if (!$(".check_btn").hasClass('checked')) {
            alert('请认真阅读注册协议');
            return false;
        }
    })
})
function checkSec(value){
    var result = 0;
    for(var i = 0, len = value.length; i < len; ++i){
        result |= charType(value.charCodeAt(i));
    }

    var level = 0;
    //对result进行四次循环，计算其level
    for(var i = 0; i <= 4; i++){
        if(result & 1){
            level ++;
        }
        //右移一位
        result = result >>> 1;
    }

    $(".streng").find('em').removeClass('btn_red');
    if(value.length >= 6){
        switch (level) {
            case 1:
                $(".streng").find('em').eq(0).addClass('btn_red');
            break;
            case 2:
                $(".streng").find('em').eq(0).addClass('btn_red');
                $(".streng").find('em').eq(1).addClass('btn_red');
            break;
            case 3:
            case 4:
                $(".streng").find('em').eq(0).addClass('btn_red');
                $(".streng").find('em').eq(1).addClass('btn_red');
                $(".streng").find('em').eq(2).addClass('btn_red');
            break;
        }
    }
}
</script>